<template>
  <table-form-dialog
    v-model="visible"
    @close="close"
    width="400px"
    @container="container"
    :title="title"
  >
    <div class="dialog-box">
      <el-form :model="form" ref="ruleForm" class="demo-ruleForm">
        <el-form-item label="" prop="region">
          <el-input
            type="textarea"
            maxlength="200"
            show-word-limit
            v-model="form.signDesc"
          ></el-input>
        </el-form-item>
      </el-form>
    </div>
  </table-form-dialog>
</template>

<script>
import TableFormDialog from "@components/dialog/Dialog";
import { mapState } from "vuex";

export default {
  name: "SignDialog",
  props: {
    id: Number,
    receiptAttachList: {
      type: Array,
      default: () => []
    },
    goodsQuantity: {
      type: Array,
      default: () => []
    },
    title: {
      type: String,
      default: "签收"
    },
    api: {
      type: Function,
      default: () => {}
    }
  },
  components: { TableFormDialog },
  computed: {
    ...mapState({
      visible: (state) => state.table.visible
    }),
    postData() {
      return {
        ...this.form
      };
    }
  },

  created() {},
  data() {
    return {
      form: {
        signDesc: ""
      }
    };
  },
  methods: {
    changFormData(value) {
      this.ruleForm = value;
    },
    close() {
      this.$store.commit("table/visibleFalse");
    },
    async container() {
      if (this.goodsQuantity.length > 0) {
        this.postData.goodsQuantity = this.goodsQuantity;
        this.postData.waybillId = this.id;
      } else {
        this.postData.id = this.id;
      }
      this.postData.attachments = this.receiptAttachList;

      let { code, message } = await this.api(this.postData);
      this.$store.commit("table/visibleFalse");
      this.$message[code === 0 ? "success" : "error"](message);
      if (code === 0) window.close();
    }
  }
};
</script>

<style></style>
